<template>
  <BasicModal v-bind="$attrs" @register="registerModal" :title="title" width="80%" :minHeight="100" :showOkBtn="false">
    <template #insertFooter> </template>
    <!-- 表单 -->
    <a-row class="dynamic-form">
      <a-form :colon="false" size="default" layout="horizontal" labelAlign="right" :labelCol="{ style: { width: '100px' } }" :model="dataForm" ref="formRef">
        <a-row :gutter="15">
          <!-- 具体表单 -->
          <a-col :span="24" class="ant-col-item">
            <a-form-item name="archiveNumber">
              <template #label>项目编号</template>
              <p>{{ dataForm.archiveNumber }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item>
              <JnpfGroupTitle contentPosition="left" content="招标方案内容"> </JnpfGroupTitle>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item name="queryType">
              <template #label>审批状态</template>
              <p>{{ dataForm.queryType }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="managementStyle">
              <template #label>管理方式</template>
              <p>{{ dataForm.managementStyle }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="planSubmissionTime">
              <template #label>方案上报时间</template>
              <p>{{ dataForm.planSubmissionTime }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="reportingCorp">
              <template #label>上报单位(部门)</template>
              <p>{{ dataForm.reportingCorp }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="tenderingEntity">
              <template #label>招标主体</template>
              <p>{{ dataForm.tenderingEntity }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="projectName">
              <template #label>项目名称</template>
              <p>{{ dataForm.projectName }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="itemClassification">
              <template #label>招标事项分类</template>
              <p>{{ dataForm.itemClassification }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="controlPrice">
              <template #label>招标控制价</template>
              <JnpfInputNumber
                v-model:value="dataForm.controlPrice"
                placeholder="请输入"
                disabled
                detailed
                :style="{ width: '100%' }"
                :step="1"
                :controls="false">
              </JnpfInputNumber>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="organizationalForm">
              <template #label>招标组织形式</template>
              <p>{{ dataForm.organizationalForm }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="biddingMethod">
              <template #label>招标方式</template>
              <p>{{ dataForm.biddingMethod }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="agencyOne">
              <template #label>代理机构</template>
              <p>{{ dataForm.agencyOne }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="10" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="scoringMethodOne">
              <template #label>评分方法</template>
              <p>{{ dataForm.scoringMethodOne }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="14" class="ant-col-item">
            <a-form-item name="scoringMethodTwo">
              <template #label>其他(评分说明)</template>
              <p>{{ dataForm.scoringMethodTwo }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="scoringIndicatorSettingsOne">
              <template #label>评分指标设置</template>
              <p>{{ dataForm.scoringIndicatorSettingsOne }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="settingOwinningBidderOne">
              <template #label>中标人设置</template>
              <p>{{ dataForm.settingOwinningBidderOne }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="annexProgrammeDocument">
              <template #label>方案上报文件名称</template>
              <JnpfUploadFile
                v-model:value="dataForm.annexProgrammeDocument"
                disabled
                detailed
                :fileSize="10"
                sizeUnit="MB"
                :limit="9"
                pathType="defaultPath"
                :isAccount="0"
                buttonText="点击上传">
              </JnpfUploadFile>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="biddingDocumentId">
              <template #label>招标文件及附件</template>
              <JnpfUploadFile
                v-model:value="dataForm.biddingDocumentId"
                disabled
                detailed
                :fileSize="10"
                sizeUnit="MB"
                :limit="9"
                pathType="defaultPath"
                :isAccount="0"
                buttonText="点击上传">
              </JnpfUploadFile>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="decisionProcedure">
              <template #label>审批/备案决策程序</template>
              <p>{{ dataForm.decisionProcedure }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="approvalDocumentsId">
              <template #label>子公司审批/备案文件</template>
              <JnpfUploadFile
                v-model:value="dataForm.approvalDocumentsId"
                disabled
                detailed
                :fileSize="10"
                sizeUnit="MB"
                :limit="9"
                pathType="defaultPath"
                :isAccount="0"
                buttonText="点击上传">
              </JnpfUploadFile>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="approvalDocumentsIdJt">
              <template #label>集团审批/备案批准文件</template>
              <JnpfUploadFile
                v-model:value="dataForm.approvalDocumentsIdJt"
                disabled
                detailed
                :fileSize="10"
                sizeUnit="MB"
                :limit="9"
                pathType="defaultPath"
                :isAccount="0"
                buttonText="点击上传">
              </JnpfUploadFile>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="finalApprovalTime">
              <template #label>方案最终审批时间</template>
              <p>{{ dataForm.finalApprovalTime }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item>
              <JnpfDivider contentPosition="center"> </JnpfDivider>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item>
              <JnpfGroupTitle contentPosition="left" content="招标结果内容"> </JnpfGroupTitle>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="resultReportingTime">
              <template #label>招标结果上报时间</template>
              <p>{{ dataForm.resultReportingTime }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="resultReportedFileName">
              <template #label>结果上报文件名称</template>
              <JnpfUploadFile
                v-model:value="dataForm.resultReportedFileName"
                disabled
                detailed
                :fileSize="10"
                sizeUnit="MB"
                :limit="9"
                pathType="defaultPath"
                :isAccount="0"
                buttonText="点击上传">
              </JnpfUploadFile>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="bidOpeningTime">
              <template #label>开标时间</template>
              <p>{{ dataForm.bidOpeningTime }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="explanationObid">
              <template #label>开标情况说明</template>
              <p>{{ dataForm.explanationObid }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="winningBidderAndWinningAmount">
              <template #label>中标人及中标金额</template>
              <p>{{ dataForm.winningBidderAndWinningAmount }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="bidEvaluationCommittee">
              <template #label>评标委员会设置</template>
              <p>{{ dataForm.bidEvaluationCommittee }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="tenderAgencyFee">
              <template #label>招标代理费</template>
              <JnpfInputNumber
                v-model:value="dataForm.tenderAgencyFee"
                placeholder="元"
                disabled
                detailed
                :style="{ width: '100%' }"
                :step="1"
                :controls="false">
              </JnpfInputNumber>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="attachmentObiddingResultsOneId">
              <template #label>招标结果附件</template>
              <JnpfUploadFile
                v-model:value="dataForm.attachmentObiddingResultsOneId"
                disabled
                detailed
                :fileSize="10"
                sizeUnit="MB"
                :limit="9"
                pathType="defaultPath"
                :isAccount="0"
                buttonText="点击上传">
              </JnpfUploadFile>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="filingDecisionProcedure">
              <template #label>审批/备案决策程序</template>
              <p>{{ dataForm.filingDecisionProcedure }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="filingResultsOneId">
              <template #label>审批/备案结果</template>
              <JnpfUploadFile
                v-model:value="dataForm.filingResultsOneId"
                disabled
                detailed
                :fileSize="10"
                sizeUnit="MB"
                :limit="9"
                pathType="defaultPath"
                :isAccount="0"
                buttonText="点击上传">
              </JnpfUploadFile>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item :labelCol="{ style: { width: '150px' } }" name="approvalTimeForResults">
              <template #label>结果最终审批时间</template>
              <p>{{ dataForm.approvalTimeForResults }}</p>
            </a-form-item>
          </a-col>
          <!-- 表单结束 -->
        </a-row>
      </a-form>
    </a-row>
  </BasicModal>
  <!-- 有关联表单详情：开始 -->
  <RelationDetail ref="relationDetailRef" />
  <!-- 有关联表单详情：结束 -->
</template>
<script lang="ts" setup>
  import { getDetailInfo } from './helper/api';
  import { getConfigData } from '/@/api/onlineDev/visualDev';
  import { reactive, toRefs, nextTick, ref, computed, unref } from 'vue';
  import { BasicModal, useModal } from '/@/components/Modal';
  // 有关联表单详情
  import RelationDetail from '/@/views/common/dynamicModel/list/detail/index.vue';
  // 表单权限
  import { usePermission } from '/@/hooks/web/usePermission';
  import { useMessage } from '/@/hooks/web/useMessage';

  interface State {
    dataForm: any;
    title: string;
  }

  defineOptions({ name: 'Detail' });
  const { createMessage, createConfirm } = useMessage();
  const [registerModal, { openModal, setModalProps }] = useModal();

  const relationDetailRef = ref<any>(null);
  const state = reactive<State>({
    dataForm: {},
    title: '详情',
  });
  const { title, dataForm } = toRefs(state);
  // 表单权限
  const { hasFormP } = usePermission();

  defineExpose({ init });

  function init(data) {
    state.dataForm.id = data.id;
    openModal();
    nextTick(() => {
      setTimeout(initData, 0);
    });
  }
  function initData() {
    changeLoading(true);
    if (state.dataForm.id) {
      getData(state.dataForm.id);
    } else {
      closeModal();
    }
  }
  function getData(id) {
    getDetailInfo(id).then(res => {
      state.dataForm = res.data || {};
      nextTick(() => {
        changeLoading(false);
      });
    });
  }

  function toDetail(modelId, id) {
    if (!id) return;
    getConfigData(modelId).then(res => {
      if (!res.data || !res.data.formData) return;
      const formConf = JSON.parse(res.data.formData);
      formConf.popupType = 'general';
      const data = { id, formConf, modelId };
      relationDetailRef.value?.init(data);
    });
  }
  function setFormProps(data) {
    setModalProps(data);
  }
  function changeLoading(loading) {
    setFormProps({ loading });
  }
</script>
